$(function(){
	   var webroot = $("#webRoot").val();
       $(".item").click(function(){
	     var exist = $(this).attr("exist");
	     if(exist == "true") {
	     	$(".countries").remove();
	        $(this).attr("exist","false");
	     }else{
	      $(".countries").remove();
	      $(".item").attr("exist","false");
	     	var url =webroot+"wx/area/county/list/";
	     	var data = {"id":$(this).attr("id")}
	      var that = $(this);
	      var size = $(".item").size();
	      $.post(url,data,function(da){
	     		 var node ="<div class='countries'>";
	             for(var i = 0;i<da.length;i++) {
	             	var d = da[i];
	             	node+="<a href="+webroot+"/wx/area/county/save/"+d.id+"><div class='country'>"+d.name+"</div></a>";
	             }
	             node+="</div>";
	             var index = $(that).index();
	             index+=1;
	             var position = Math.ceil(index/3)*3-1;
	             if(position>=size) {
	              position = size-1;
	             }
	             $(".item:eq("+position+")").after(node);
	     	},"json");
	      $(this).attr("exist","true");
	     }
	       /*var top = $(this).offset().top;
	       var left= $(this).offset().left;
	       var height = $(this).height();
	       var top=top+height;
	       var node ="<div class='countries'></div>";
	       $('body').append(node);
	       var width = $("#container").width()*0.95;
	       $(".countries").css({
	       	   "top":top,
	       	   "left":left,
	       	   "width":width,
	       	   "display":"block"
	       });
	       $('body').append(node);
	     	
	     //}*/
	 });            
})